#app {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: center;
		color: #2c3e50;
	}

	.wrap_all {
		width: 97%;
		margin: 5px auto;
		text-align: left;
	}

	.wrap_top {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-align: center;
		align-items: center;
		position: relative;
		margin-bottom: 10px;
	}

	.logo {
		width: 50px;
		height: 50px;
		margin-right: 5px;
		border-radius: 50%;
	}

	.title1 {
		color: #424242;
		font-size: 10px;
	}

	.font_pink {
		color: #f0838d;
		font-size: 10px;
	}

	.kefu {
		position: absolute;
		right: 0;
		border: 1px solid hsla(0, 1%, 68%, .63);
		padding: 7px 20px;
		border-radius: 20px;
		font-size: 10px;
		color: #424242;
	}

	.swipe {
		width: 100vw;
		height: 180px;
		text-align: center;
	}

	.mint-swipe,
	.mint-swipe-items-wrap {
		overflow: hidden;
		position: relative;
		height: 100%;
	}

	.mint-swipe-items-wrap>div.is-active {
		display: block;
		transform: none;
	}

	.swipe_haibao {
		width: 100%;
	}

	.mint-swipe-items-wrap>div {
		position: absolute;
		transform: translateX(-100%);
		width: 100%;
		height: 100%;
		display: none;
	}

	.swiper_img {
		width: 100%;
		height: 100%;
		border-radius: 20px;
	}

	.mint-swipe-indicators {
		position: absolute;
		bottom: 10px;
		left: 50%;
		transform: translateX(-50%);
	}

	.mint-swipe-indicator.is-active {
		background: #fff;
	}

	.mint-swipe-indicator {
		width: 8px;
		height: 8px;
		display: inline-block;
		border-radius: 100%;
		background: #000;
		opacity: .2;
		margin: 0 3px;
	}

	.tip2 {
		color: #939393;
		margin: 5px auto 10px;
		text-align: center;
		font-size: 10px;
	}

	.join_btn {
		background: url(https://classmate.zhicloudcn.com/2019-570a11cb-41eb-40ee-ad38-544d5f75caa7.png);
		width: 100%;
		height: 60px;
		background-size: 100% 100%;
		color: #fff;
		text-align: center;
		line-height: 60px;
	}

	.wrap_2btn {
		width: 50%;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: justify;
		justify-content: space-between;
		margin: 10px auto;
		color: #424242;
		font-size: 12px;
	}

	.history,
	.my_cp {
		text-align: center;
	}

	.history_icon,
	.my_cp_icon {
		width: 40px;
		height: 40px;
		margin-bottom: 10px;
	}

	.history,
	.my_cp {
		text-align: center;
	}

	.history_icon,
	.my_cp_icon {
		width: 40px;
		height: 40px;
		margin-bottom: 10px;
	}

	.reduce {
		text-align: center;
		color: #f0838d;
		margin-top: 40px;
		margin-bottom: 10px;
	}

	.reduce_icon {
		padding-right: 12px;
		position: relative;
		margin-top: -12px;
		animation: bounce-down-data-v-7e8a7053 1.5s linear infinite;
	}

	.reduce_text {
		margin: 15px auto;
		margin-left: -15px;
	}

	.bottom_img {
		width: 100%;
	}

	.join_btn {
		background: url(https://classmate.zhicloudcn.com/2019-570a11cb-41eb-40ee-ad38-544d5f75caa7.png);
		width: 100%;
		height: 60px;
		background-size: 100% 100%;
		color: #fff;
		text-align: center;
		line-height: 60px;
	}

	.mint-indicator {
		transition: opacity .2s linear;
	}

	.mint-indicator-wrapper {
		top: 50%;
		left: 50%;
		position: fixed;
		transform: translate(-50%, -50%);
		border-radius: 5px;
		background: rgba(0, 0, 0, .7);
		color: #fff;
		box-sizing: border-box;
		text-align: center;
	}

	.mint-indicator-mask {
		top: 0;
		left: 0;
		position: fixed;
		width: 100%;
		height: 100%;
		opacity: 0;
		background: transparent;
	}

	.mint-indicator-spin {
		display: inline-block;
		text-align: center;
	}

	.mint-indicator-text {
		display: block;
		color: #fff;
		text-align: center;
		margin-top: 10px;
		font-size: 16px;
	}

	.mint-spinner-snake {
		animation: mint-spinner-rotate .8s infinite linear;
		border: 4px solid transparent;
		border-radius: 50%;
	}

	@keyframes mint-spinner-rotate {
		0% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-webkit-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	.outmask2 {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(61, 61, 61, .473);
		z-index: 10;
		text-align: center;
	}

	.wrap_code {
		width: 100%;
		background: #fff;
		margin-top: 12vh;
		padding-top: 20px;
		border-radius: 10px;
		text-align: center;
	}

	.tips2 {
		margin-bottom: 15px;
		font-weight: 700;
	}

	.tip_gray {
		color: #646464;
		font-size: 15px;
		margin-top: -12px;
	}

	.tips4 {
		width: 80%;
		text-align: left;
		margin: 5px auto;
		font-size: 15px;
	}

	.code_img {
		width: 70%;
		height: 70%;
		margin-top: 3%;
	}
	.outmask{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(61,61,61,.473);
		z-index: 10;
		text-align: center;
	}
	.code_mask{
		width: 96%;
		height: 120vw;
		text-align: center;
		overflow: scroll;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-direction: column;
		flex-direction: column;
		-ms-flex-pack: center;
		justify-content: center;
	}
	.mint-popup {
		position: fixed;
		background: #f0838d;
		top: 50%;
		left: 50%;
		transform: translate3d(-50%,-50%,0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transition: .2s ease-out;
	}
	.wrap_code{
		width: 100%;
		background: #fff;
		margin-top: 12vh;
		padding-top: 20px;
		border-radius: 10px;
		text-align: center;
	}
	.code_img{
		width: 70%;
		height: 70%;
		margin-top: 3%;
	}
	.v-modal {
		width: 100%;
	}
	.font1 {
		color:#fcfcfd;
		font-size:16px;
		 font-family:"黑体";
	}
	.font2 {
		color:#fcfcfd;
		font-size:20px;
		font-family:"黑体";
	}
	.font3 {
		color:#fcfcfd;
		font-size:14px
	}
	.font4 {
		color:#fcfcfd;
		font-size:12px
	}